import { WeaLeftTree, WeaTop, WeaNewScroll } from 'ecCom';
import { observer } from 'mobx-react';
import { toJS } from 'mobx';

@observer
class ListLeftTree extends React.Component {

    render() {
        return (
            <div className="wea-docback-dummycategory g-leftTree">
                {this.getTree()}
            </div>
        );
    }

    getTree = () => {
        const { treeStore, apisType, title } = this.props;
        const { setSelectedTreeKey, selectedTreeKey, parentIds, treeData } = treeStore;
        if (title) {//xk:带top的左侧树 适用任务台账
            return (<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@bzt61p`}
                title={title}
                icon={<i className="icon-coms-government" />}
                iconBgcolor="#f14a2d"
            >
                <WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@4afw4n`} height={treeStore.commonStore.contentHeight - 129}>
                    <WeaLeftTree ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftTree@w7reop`}
                        datas={toJS(treeData)}
                        defaultExpandLevel={3}
                        itemMainKey="id"
                        defaultExpandLevel={2}
                        expandedKeys={parentIds}
                        selectedKeys={[selectedTreeKey]}
                        onSelect={(selectedTreeKey, topTabCount, countsType) => {
                            setSelectedTreeKey(countsType.node.props.data.key, apisType);
                        }}
                    />
                </WeaNewScroll>
            </WeaTop>
            )
        } else {//普通左侧树
            return (
                <div className="wea-docback-dummycategory g-leftTree" style={{ marginTop: '3px' }}>
                    <WeaLeftTree ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftTree@fac329`}
                        datas={toJS(treeData)}
                        itemMainKey="id"
                        defaultExpandLevel={2}
                        expandedKeys={parentIds}
                        selectedKeys={[selectedTreeKey]}
                        onSelect={(selectedTreeKey, topTabCount, countsType) => {
                            setSelectedTreeKey(countsType.node.props.data.key, apisType);
                        }}
                    />
                </div>
            )
        }
    }
}

export default ListLeftTree;
